<template>
	<view class="dynaList">
		<navBar isBack title="店铺动态" backColor="#333" color="#333" background="#fff"></navBar>
		<view class="content">
			<view class="ListView" v-for="(item, index) in dynaList" :key="index" @click="toInfo(item.id)">
				<view class="ListView_Mes">
					<view>
						<view class="ListView_tit">{{ item.title }}</view>
						<view class="ListView_time">
							<text>{{ $utils.getTimeRelation(item.create_time * 1000) }}</text>
							<!-- <text class="ListView_Dian"></text> -->
							<text style="margin-left: 20rpx;">{{item.video_num}} 播放量</text>
						</view>
					</view>
					<view class="ListView_Del" @click.stop="toDeLDyna(item.id)"><u-icon name="trash" color="#292929" size="34"></u-icon></view>
				</view>
				<view class="ListView_Main" v-if="item.type == 0">
					<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" indicator-active-color="#DBA954">
						<swiper-item class="swiper-item" v-for="(item1, index1) in item.media" :key="index1">
							<view class="ListView_Media">
								<view class="ListView_image"><image :src="item1.path"></image></view>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<view class="ListView_Main" v-else>
					<swiper :indicator-dots="false" :autoplay="false" :interval="3000" :duration="1000">
						<swiper-item class="swiper-item" v-for="(item1, index1) in item.media" :key="index1">
							<view class="ListView_Media">
								<view class="ListView_image"><video :src="item1.path" controls></video></view>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<view class="ListView_line">
					<view class="ListView_Cookie" @click.stop="LookHistory(item.id)">
						<u-icon name="share" label-size="28" color="#D5AC4E" label-color="#D5AC4E" label="转发记录" size="36"></u-icon>
					</view>
					<view class="ListView_Data">
						<view class="ListView_tools" @click.stop="ShareItem(item.id)">
							<view class="iconfont">&#xe6a3;</view>
							转发
						</view>
						<view class="ListView_tools">
							<view class="iconfont">&#xe6a2;</view>
							{{ item.comment_num }}
						</view>
						<view class="ListView_tools">
							<view class="iconfont">&#xe6a1;</view>
							{{ item.support_num }}
						</view>
					</view>
				</view>
			</view>
			<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
		</view>
		<view class="btn"><button type="default" @click="toSubmit">发布动态</button></view>
		<u-popup v-model="popShow" mode="center" closeable border-radius="20">
			<view class="popStyle">
				<h3>请选择动态发布类型</h3>
				<view class="img">
					<view class="imgBox" @click="toReleMsg('img')">
						<image :src="`${baseImg}/static/adminShop/upImg.png`" mode=""></image>
						图片
					</view>
					<view class="imgBox" @click="toReleMsg('video')">
						<image :src="`${baseImg}/static/adminShop/upVideo.png`" mode=""></image>
						视频
					</view>
				</view>
			</view>
		</u-popup>
		<view class="cu-modal bottom-modal" :class="[is_show_model ? 'show' : '']" @click.stop="is_show_model = false">
			<view class="cu-dialog bottom-md" style="border-top-left-radius: 20rpx;border-top-right-radius: 20rpx;" @click.stop="">
				<view class="md-content">
					<view class="md-content-item" @click="toUserMini">
						<image open-type="share" src="../../../static/zhangyu-qrcode-poster/wechat.png"></image>
						<view>分享给用户</view>
						<button @click="is_show_model = false" class="sharebtn"></button>
					</view>
					<view class="md-content-item" @click="sharePoster">
						<image src="../../../static/zhangyu-qrcode-poster/haibao.png"></image>
						<view>生成海报</view>
					</view>
				</view>
				<view class="cancel" @click="cancelShare">取消</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			status: 'loadmore',
			iconType: 'flower',
			loadText: {
				loadmore: '轻轻上拉',
				loading: '努力加载中',
				nomore: '实在没有了~'
			},
			baseImg: this.$static,
			page: 1,
			pagesize: 10,
			dynaList: [],
			nowNum: 1,
			popShow: false,
			is_show_model: false ,//是否显示分享模态窗
			Share_trend_id:null,
			moduleType:'', //模块(1合作方,2超级管家)
		};
	},
	onLoad(options) {
		this.moduleType = options.moduleType
		// this.getDynaList();
	},
	onShow() {
		this.getDynaList();
	},
	onReachBottom() {
		this.page++;
		this.status = 'loading';
		let params = {
			partner_id: this.$store.state.index.sid,
			partner_type: this.$store.state.index.role,
			user_id: this.$store.state.index.userId,
			page: this.page,
			type: '',
			pagesize: this.pagesize,
			module_type:this.moduleType=='superHK'?2:1, //模块（1-合作方，2-超级管家）
		};
		this.$api.getDynaList(params).then(res => {
			// console.log(res,'动态列表')
			if (res.code == 1) {
				if (!res.data.length) {
					this.status = 'nomore';
				} else {
					this.status = 'loading';
				}
				this.dynaList = this.dynaList.concat(res.data);
			}
		});
		uni.hideLoading();
	},
	methods: {
		LookHistory(row) {
			console.log(row);
			uni.navigateTo({
				url: '/pagesFour/home/dynamicManage/history?trend_id=' + row
			});
		},
		ShareItem(row){
			this.is_show_model = true
			this.Share_trend_id = row
		},
		cancelShare(){
			this.is_show_model = false
			this.Share_trend_id = null
		},
		//分享海报
		sharePoster() {
			//获取带参数二维码并传递
			this.is_show_model = false;
			uni.navigateTo({
				url: '/pagesFour/home/dynamicManage/share?trendId=' + this.Share_trend_id
			});
		},
		// 小程序跳转
		toUserMini() {
			let user_id = this.$store.state.index.userId;
			this.$api.Getforward({ trend_id: this.Share_trend_id }).then(res => {
				// console.log(res,'动态列表')
				if (res.code == 1) {
					// console.log(res.data);
					var forwardID = res.data.forward_id
					uni.navigateToMiniProgram({
						appId: 'wx66230223cee807f1', // 其他小程序APPID
						envVersion: 'trial',
						path: `/pages_design/pages/design/dynamic/player`, //其他小程序地址
						// '/pages_design/pages/design/dynamic/player?trendId=' + this.trend_id + '&share_uid=' + this.userId + '&forward_id=' + res.data.forward_id
						extraData: {
							trendId: this.trend_id,
							share_uid: user_id,
							forward_id: this.forwardID
						},
						success: res => {
							// 打开成功
							console.log('打开成功', res);
						},
						fail: err => {
							console.log('打开失败');
						}
					});
				}
			});
		},
		// 获取动态列表
		getDynaList() {
			this.page = 1;
			uni.showLoading({
				title: '加载中...'
			});
			let params = {
				partner_id: this.$store.state.index.sid,
				partner_type: this.$store.state.index.role,
				user_id: this.$store.state.index.userId,
				page: this.page,
				type: '',
				pagesize: this.pagesize,
				module_type:this.moduleType=='superHK'?2:1, //模块（1-合作方，2-超级管家）
			};
			this.$api.getDynaList(params).then(res => {
				// console.log(res,'动态列表')
				if (res.code == 1) {
					if (res.data.length < 10) {
						this.status = 'nomore';
					}
					this.dynaList = res.data ? res.data : [];
				}
			});
			uni.hideLoading();
		},
		// 跳转到发布动态
		toReleMsg(type) {
			uni.redirectTo({
				url: `/pagesFour/home/releMsg/releMsg?type=${type}&moduleType=${this.moduleType}`
			});
			this.popShow = false;
		},
		// 图片
		changeImg(e) {
			// console.log(e,'图片切换')
			this.nowNum = e.detail.current + 1;
		},

		// 点击发布动态
		toSubmit() {
			this.popShow = true;
		},
		// 删除按钮
		toDeLDyna(id) {
			uni.showModal({
				content: '确定删除该条动态吗？',
				success: res => {
					if (res.confirm) {
						this.$api.delDyna({ trend_id: id }).then(res => {
							// console.log(res,'删除结果')
							if (res.code == 1) {
								uni.showToast({
									title: '删除成功',
									icon: 'success'
								});
								this.getDynaList();
							}
						});
					}
				}
			});
		},

		// 进入动态详情
		toInfo(id) {
			uni.navigateTo({
				url: 'dynamicInfo?trend_id=' + id
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import '../../iconfont.css';
.dynaList {
	padding: 36rpx 32rpx;
	.content {
		margin-bottom: 140rpx;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		.ListView {
			background: #ffffff;
			box-shadow: 0rpx 2rpx 14rpx 0px #f1f1f1;
			border-radius: 10rpx;
			padding: 35rpx 20rpx;
			margin-bottom: 23rpx;
			.ListView_Mes {
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-bottom: 28rpx;
				.ListView_tit {
					font-size: 30rpx;
					font-weight: bold;
					color: #292929;
					margin-bottom: 17rpx;
				}
				.ListView_time {
					display: flex;
					align-items: center;
					font-size: 22rpx;
					font-weight: 500;
					color: #5f5f61;
					.ListView_Dian {
						margin: 0 12rpx;
						width: 4rpx;
						height: 4rpx;
						background: #5f5f61;
						border-radius: 50%;
					}
				}
				.ListView_Del {
					border-radius: 100%;
					width: 66rpx;
					height: 66rpx;
					background: #f4f4f4;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
			.ListView_Main {
				height: 272rpx;
				border-radius: 10rpx;
				overflow: hidden;
				margin-bottom: 30rpx;
				.swiper-item {
					border-radius: 10rpx;
					overflow: hidden;
				}
				.ListView_image {
					width: 100%;
					height: 272rpx;
				}
			}
			.ListView_line {
				display: flex;
				align-items: center;
				justify-content: space-between;
				.ListView_Cookie {
					display: flex;
					align-items: center;
					color: #d5ac4e;
				}
				.ListView_Data {
					display: flex;
					align-items: center;
					.ListView_tools {
						display: flex;
						align-items: center;
						margin-right: 40rpx;
						.iconfont {
							margin-right: 10rpx;
						}
					}
					.ListView_tools:last-child {
						margin-right: 0rpx;
					}
				}
			}
		}
	}
	.btn {
		width: 100%;
		height: 120rpx;
		background-color: #fff;
		position: fixed;
		left: 0;
		z-index: 10;
		bottom: 0;
		height: calc(120rpx+ constant(safe-area-inset-bottom));
		height: calc(120rpx + env(safe-area-inset-bottom));
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		button {
			width: 606rpx;
			height: 80rpx;
			border-radius: 46rpx;
			margin: 20rpx auto;
			background: linear-gradient(86deg, #dba954 0%, #eaba6a 100%);
			box-shadow: 0px 3px 6px rgba(219, 169, 84, 0.3);
			font: 500 32rpx/80rpx PingFang SC;
			color: #fff;
		}
	}
	.popStyle {
		padding: 30rpx;
		text-align: center;
		h3 {
			font: 600 28rpx/20rpx PingFang SC;
			color: #0a0605;
			margin: 30rpx 0;
		}
		.img {
			display: flex;
			justify-content: space-around;
			align-items: center;
			.imgBox {
				margin: 40rpx 50rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
				image {
					width: 168rpx;
					height: 136rpx;
				}
				font: 500 26rpx/20rpx PingFang SC;
				color: #0a0605;
			}
		}
	}
}

.cu-modal {
	position: fixed;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	top: 0;
	display: none;
	width: 100%;
}

.show {
	display: block;
}

.bottom-md {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #fff;
}

.share {
	position: fixed;
	color: #ffffff;
	right: 0;
	bottom: 190rpx;
	background: linear-gradient(to bottom right, #fe726b, #fe956b);
	padding: 10rpx 10rpx 10rpx 20rpx;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
	box-shadow: 0 0 20upx rgba(0, 0, 0, 0.09);
}

.cancel {
	width: 100vw;
	padding: 30rpx;
	text-align: center;
	background: #ffffff;
	color: #888;
	font-weight: normal;
	font-size: 30rpx;
}

.md-content {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 50rpx 0;
}

.md-content-item {
	margin: 0 70rpx;
	position: relative;
}

.md-content-item image {
	width: 100rpx;
	height: 100rpx;
	margin: auto;
}

.md-content-item view {
	margin-top: 15rpx;
	font-size: 28rpx;
}

.sharebtn {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
}
</style>
<<<<<<< HEAD
=======
<template>
	<view class="dynaList">
		<navBar isBack title="店铺动态" backColor="#333" color="#333" background="#fff"></navBar>
		<view class="content">
			<view class="ListView" v-for="(item, index) in dynaList" :key="index" @click="toInfo(item.id)">
				<view class="ListView_Mes">
					<view>
						<view class="ListView_tit">{{ item.title }}</view>
						<view class="ListView_time">
							<text>{{ $utils.getTimeRelation(item.create_time * 1000) }}</text>
							<!-- <text class="ListView_Dian"></text> -->
							<text style="margin-left: 20rpx;">{{ item.video_num }} 播放量</text>
						</view>
					</view>
					<view class="ListView_Del" @click.stop="toDeLDyna(item.id)"><u-icon name="trash" color="#292929" size="34"></u-icon></view>
				</view>
				<view class="ListView_Main" v-if="item.type == 0">
					<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" indicator-active-color="#DBA954">
						<swiper-item class="swiper-item" v-for="(item1, index1) in item.media" :key="index1">
							<view class="ListView_Media">
								<view class="ListView_image"><image :src="item1.path"></image></view>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<view class="ListView_Main" v-else>
					<swiper :indicator-dots="false" :autoplay="false" :interval="3000" :duration="1000">
						<swiper-item class="swiper-item" v-for="(item1, index1) in item.media" :key="index1">
							<view class="ListView_Media">
								<view class="ListView_image"><video :src="item1.path" :cover="item1.cover" controls></video></view>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<view class="ListView_line">
					<view class="ListView_Cookie" @click.stop="LookHistory(item.id)">
						<u-icon name="share" label-size="28" color="#D5AC4E" label-color="#D5AC4E" label="转发记录" size="36"></u-icon>
					</view>
					<view class="ListView_Data">
						<view class="ListView_tools" @click.stop="ShareItem(item)">
							<view class="iconfont">&#xe6a3;</view>
							转发
						</view>
						<view class="ListView_tools">
							<view class="iconfont">&#xe6a2;</view>
							{{ item.comment_num }}
						</view>
						<view class="ListView_tools">
							<view class="iconfont">&#xe6a1;</view>
							{{ item.support_num }}
						</view>
					</view>
				</view>
			</view>
			<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
		</view>
		<view class="btn"><button type="default" @click="toSubmit">发布动态</button></view>
		<u-popup v-model="popShow" mode="center" closeable border-radius="20">
			<view class="popStyle">
				<h3>请选择动态发布类型</h3>
				<view class="img">
					<view class="imgBox" @click="toReleMsg('img')">
						<image :src="`${baseImg}/static/adminShop/upImg.png`" mode=""></image>
						图片
					</view>
					<view class="imgBox" @click="toReleMsg('video')">
						<image :src="`${baseImg}/static/adminShop/upVideo.png`" mode=""></image>
						视频
					</view>
				</view>
			</view>
		</u-popup>
		<view class="cu-modal bottom-modal" :class="[is_show_model ? 'show' : '']" @click.stop="is_show_model = false">
			<view class="cu-dialog bottom-md" style="border-top-left-radius: 20rpx;border-top-right-radius: 20rpx;" @click.stop="">
				<view class="md-content">
					<view class="md-content-item" @click="toUserMini">
						<image open-type="share" src="../../../static/zhangyu-qrcode-poster/wechat.png"></image>
						<view>分享给用户</view>
						<button @click="is_show_model = false" class="sharebtn"></button>
					</view>
					<view class="md-content-item" @click="sharePoster">
						<image src="../../../static/zhangyu-qrcode-poster/haibao.png"></image>
						<view>生成海报</view>
					</view>
				</view>
				<view class="cancel" @click="cancelShare">取消</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			status: 'loadmore',
			iconType: 'flower',
			loadText: {
				loadmore: '轻轻上拉',
				loading: '努力加载中',
				nomore: '实在没有了~'
			},
			baseImg: this.$static,
			page: 1,
			pagesize: 10,
			dynaList: [],
			nowNum: 1,
			popShow: false,
			is_show_model: false, //是否显示分享模态窗
			Share_trend_id: null,
			IsType: null //视频还是图片
		};
	},
	onLoad() {
		this.getDynaList();
	},
	onShow() {
		this.getDynaList();
	},
	onReachBottom() {
		this.page++;
		this.status = 'loading';
		let params = {
			partner_id: this.$store.state.index.sid,
			partner_type: this.$store.state.index.role,
			user_id: this.$store.state.index.userId,
			page: this.page,
			type: '',
			pagesize: this.pagesize
		};
		this.$api.getDynaList(params).then(res => {
			// console.log(res,'动态列表')
			if (res.code == 1) {
				if (!res.data.length) {
					this.status = 'nomore';
				} else {
					this.status = 'loading';
				}
				this.dynaList = this.dynaList.concat(res.data);
			}
		});
		uni.hideLoading();
	},
	methods: {
		LookHistory(row) {
			// console.log(row);
			uni.navigateTo({
				url: '/pagesFour/home/dynamicManage/history?trend_id=' + row
			});
		},
		ShareItem(row) {
			console.log(row);
			this.IsType = row.type;
			this.is_show_model = true;
			this.Share_trend_id = row.id;
		},
		cancelShare() {
			this.is_show_model = false;
			this.Share_trend_id = null;
		},
		//分享海报
		sharePoster() {
			//获取带参数二维码并传递
			this.is_show_model = false;
			uni.navigateTo({
				url: '/pagesFour/home/dynamicManage/share?trendId=' + this.Share_trend_id
			});
		},
		// 小程序跳转
		toUserMini() {
			let user_id = this.$store.state.index.userId;
			// this.$api.Getforward({ trend_id: this.Share_trend_id }).then(res => {
			// console.log(res,'动态列表')
			// if (res.code == 1) {
			// console.log(res.data);
			// var forwardID = res.data.forward_id;
			if (this.IsType == 1) {
				uni.navigateToMiniProgram({
					appId: 'wx66230223cee807f1', // 其他小程序APPID
					// appId: 'wx66230223cee807f1', // 其他小程序APPID测试
					envVersion: 'trial',
					// path: `/pages_design/pages/design/dynamic/player`, //其他小程序地址 + '&forward_id=' + forwardID
					path: '/pages_design/pages/design/dynamic/player?trendId=' + this.Share_trend_id + '&share_uid=' + user_id,
					// extraData: {
					// 	trendId: this.Share_trend_id,
					// 	share_uid: user_id,
					// 	forward_id: this.forwardID
					// },
					success: res => {
						// 打开成功
						console.log('打开成功', res);
						console.log('打开成功', this.Share_trend_id, user_id, forwardID);
					},
					fail: err => {
						console.log('打开失败');
					}
				});
			} else {
				uni.navigateToMiniProgram({
					appId: 'wx66230223cee807f1', // 其他小程序APPID 
					// appId: 'wx66230223cee807f1', // 其他小程序APPID测试
					envVersion: 'trial',
					// path: `/pages_design/pages/design/dynamic/player`, //其他小程序地址 + '&forward_id=' + forwardID
					path: '/pages_design/pages/design/dynamic/dynamic?trendId=' + this.Share_trend_id + '&share_uid=' + user_id,
					success: res => {
						// 打开成功
						console.log('打开成功', res);
						console.log('打开成功', this.Share_trend_id, user_id, forwardID);
					},
					fail: err => {
						console.log('打开失败');
					}
				});
			}
			// }
			// });
		},
		// 获取动态列表
		getDynaList() {
			this.page = 1;
			uni.showLoading({
				title: '加载中...'
			});
			let params = {
				partner_id: this.$store.state.index.sid,
				partner_type: this.$store.state.index.role,
				user_id: this.$store.state.index.userId,
				page: this.page,
				type: '',
				pagesize: this.pagesize
			};
			this.$api.getDynaList(params).then(res => {
				// console.log(res,'动态列表')
				if (res.code == 1) {
					if (res.data.length < 10) {
						this.status = 'nomore';
					}
					this.dynaList = res.data ? res.data : [];
				}
			});
			uni.hideLoading();
		},
		// 跳转到发布动态
		toReleMsg(type) {
			uni.redirectTo({
				url: '/pagesFour/home/releMsg/releMsg?type=' + type
			});
			this.popShow = false;
		},
		// 图片
		changeImg(e) {
			// console.log(e,'图片切换')
			this.nowNum = e.detail.current + 1;
		},

		// 点击发布动态
		toSubmit() {
			this.popShow = true;
		},
		// 删除按钮
		toDeLDyna(id) {
			uni.showModal({
				content: '确定删除该条动态吗？',
				success: res => {
					if (res.confirm) {
						this.$api.delDyna({ trend_id: id }).then(res => {
							// console.log(res,'删除结果')
							if (res.code == 1) {
								uni.showToast({
									title: '删除成功',
									icon: 'success'
								});
								this.getDynaList();
							}
						});
					}
				}
			});
		},

		// 进入动态详情
		toInfo(id) {
			uni.navigateTo({
				url: 'dynamicInfo?trend_id=' + id
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import '../../iconfont.css';
.dynaList {
	padding: 36rpx 32rpx;
	.content {
		margin-bottom: 140rpx;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		.ListView {
			background: #ffffff;
			box-shadow: 0rpx 2rpx 14rpx 0px #f1f1f1;
			border-radius: 10rpx;
			padding: 35rpx 20rpx;
			margin-bottom: 23rpx;
			.ListView_Mes {
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-bottom: 28rpx;
				.ListView_tit {
					font-size: 30rpx;
					font-weight: bold;
					color: #292929;
					margin-bottom: 17rpx;
				}
				.ListView_time {
					display: flex;
					align-items: center;
					font-size: 22rpx;
					font-weight: 500;
					color: #5f5f61;
					.ListView_Dian {
						margin: 0 12rpx;
						width: 4rpx;
						height: 4rpx;
						background: #5f5f61;
						border-radius: 50%;
					}
				}
				.ListView_Del {
					border-radius: 100%;
					width: 66rpx;
					height: 66rpx;
					background: #f4f4f4;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
			.ListView_Main {
				height: 272rpx;
				border-radius: 10rpx;
				overflow: hidden;
				margin-bottom: 30rpx;
				.swiper-item {
					border-radius: 10rpx;
					overflow: hidden;
				}
				.ListView_image {
					width: 100%;
					height: 272rpx;
				}
			}
			.ListView_line {
				display: flex;
				align-items: center;
				justify-content: space-between;
				.ListView_Cookie {
					display: flex;
					align-items: center;
					color: #d5ac4e;
				}
				.ListView_Data {
					display: flex;
					align-items: center;
					.ListView_tools {
						display: flex;
						align-items: center;
						margin-right: 40rpx;
						.iconfont {
							margin-right: 10rpx;
						}
					}
					.ListView_tools:last-child {
						margin-right: 0rpx;
					}
				}
			}
		}
	}
	.btn {
		width: 100%;
		height: 120rpx;
		background-color: #fff;
		position: fixed;
		left: 0;
		z-index: 10;
		bottom: 0;
		height: calc(120rpx+ constant(safe-area-inset-bottom));
		height: calc(120rpx + env(safe-area-inset-bottom));
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		button {
			width: 606rpx;
			height: 80rpx;
			border-radius: 46rpx;
			margin: 20rpx auto;
			background: linear-gradient(86deg, #dba954 0%, #eaba6a 100%);
			box-shadow: 0px 3px 6px rgba(219, 169, 84, 0.3);
			font: 500 32rpx/80rpx PingFang SC;
			color: #fff;
		}
	}
	.popStyle {
		padding: 30rpx;
		text-align: center;
		h3 {
			font: 600 28rpx/20rpx PingFang SC;
			color: #0a0605;
			margin: 30rpx 0;
		}
		.img {
			display: flex;
			justify-content: space-around;
			align-items: center;
			.imgBox {
				margin: 40rpx 50rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
				image {
					width: 168rpx;
					height: 136rpx;
				}
				font: 500 26rpx/20rpx PingFang SC;
				color: #0a0605;
			}
		}
	}
}

.cu-modal {
	position: fixed;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	top: 0;
	display: none;
	width: 100%;
}

.show {
	display: block;
}

.bottom-md {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #fff;
}

.share {
	position: fixed;
	color: #ffffff;
	right: 0;
	bottom: 190rpx;
	background: linear-gradient(to bottom right, #fe726b, #fe956b);
	padding: 10rpx 10rpx 10rpx 20rpx;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
	box-shadow: 0 0 20upx rgba(0, 0, 0, 0.09);
}

.cancel {
	width: 100vw;
	padding: 30rpx;
	text-align: center;
	background: #ffffff;
	color: #888;
	font-weight: normal;
	font-size: 30rpx;
}

.md-content {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 50rpx 0;
}

.md-content-item {
	margin: 0 70rpx;
	position: relative;
}

.md-content-item image {
	width: 100rpx;
	height: 100rpx;
	margin: auto;
}

.md-content-item view {
	margin-top: 15rpx;
	font-size: 28rpx;
}

.sharebtn {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
}
</style>
>>>>>>> 3a05ebd5f0211249e89edb90f9215d5fccc98325
=======
>>>>>>> 70f353443ef0e9074eaa51cedede1bd4ecdf40ce
